
{include file="layout/css"}
{include file="layout/header"}
<div class="ew-banner" style="box-shadow: 0 0 6px rgba(0,0,0,.101562);">
    <div class="layui-container ">
        <div class="layui-row layui-col-space25" style="margin-top: 10px;">
            <div class="layui-col-md6  layui-col-xs12">
                <p style="font-size: 30px;font-weight: 500;margin-top: 30px;color: #4ACA85;">UniTp商城</p>
                <p style="font-size: 20px;font-weight: 500;margin-top: 30px;">基于Uniapp+ThinkPHP6极速商城开发框架</p>
                <p style="font-size: 13.8px;font-weight: 500;margin-top: 60px;">让商城开发变得更简单</p>
                <div class="ew-banner-btngroup" style="margin-top: 50px;margin-bottom: 50px;">
                    <ul class="layui-nav" style="background-color: white;" lay-filter="ew-header-nav">
                        <li class="layui-nav-item">
                            <a href="{:url('Home/check_auth')}" class="layui-btn layui-btn-primary" nav-scroll="pricing">
                                下载源码
                            </a>
                        </li>
                        <li class="layui-nav-item">
                            <a href="https://demo.laytp.com/" target="_blank" class="layui-btn" nav-scroll="pricing">
                                演示站
                            </a>
                        </li>
                        <span class="layui-nav-bar"></span>
                    </ul>
                </div>
            </div>
            <div class="layui-col-md6 layui-col-xs12">
                <div class="ew-banner-right">
                    <img class="show" style="width: 94%;" src="/static/home/images/home-index.png">
                </div>
            </div>
        </div>
    </div>
    <br>
    <br>
</div>
<div class="section">

</div>
<div class="section" style="padding-bottom: 10px;padding-top: 15px;">
    <div class="section-title">
    </div>
    <div class="layui-container my-container">
        <div class="layui-row layui-col-space30">
            <div class="layui-col-lg3 layui-col-md6 layui-col-sm6 layui-col-xs12">
                <div class="feature">
<!--                    <img style="width:186px;height: 154px;" src="/component/front/images/un11.svg">-->
<!--                    <br><br>-->
                    <h3>Diy页面</h3>
                    <p style="font-size: 14.8px;letter-spacing: 2px;">自定义装修设计首页样式</p>
                    <p style="font-size: 14.8px;letter-spacing: 2px;">众多组件，满足您各种设计需求</p>
                </div>
            </div>
            <div class="layui-col-lg3 layui-col-md6 layui-col-sm6 layui-col-xs12">
                <div class="feature">
<!--                    <img style="width:186px;height: 154px;" src="/component/front/images/un11.svg">-->
<!--                    <br><br>-->
                    <h3>免费升级</h3>
                    <p style="font-size: 14.8px;letter-spacing: 2px;">一次授权，永久免费</p>
                    <p style="font-size: 14.8px;letter-spacing: 2px;">BUG修复、基础功能开发永久免费升级</p>
                </div>
            </div>
            <div class="layui-col-lg3 layui-col-md6 layui-col-sm6 layui-col-xs12">
                <div class="feature">
<!--                    <img style="width:186px;height: 154px;" src="/component/front/images/un32.svg">-->
<!--                    <br><br>-->
                    <h3>源码开放</h3>
                    <p style="font-size: 14.8px;letter-spacing: 2px;">源码注释详细，便于阅读</p>
                    <p style="font-size: 14.8px;letter-spacing: 2px;">代码无后门，可放心使用</p>
                </div>
            </div>
            <div class="layui-col-lg3 layui-col-md6 layui-col-sm6 layui-col-xs12">
                <div class="feature">
<!--                    <img style="width:186px;height: 154px;" src="/component/front/images/un35.svg">-->
<!--                    <br><br>-->
                    <h3>功能完善</h3>
                    <p style="font-size: 14.8px;letter-spacing: 2px;">丰富的常用基础功能</p>
                    <p style="font-size: 14.8px;letter-spacing: 2px;">秒杀、积分、三级分销、优惠券等各种营销活动</p>
                </div>
            </div>
<!--            <div class="layui-col-lg3 layui-col-md6 layui-col-sm6 layui-col-xs12">-->
<!--                <div class="feature">-->
<!--                    <img style="width:186px;height: 154px;" src="/component/front/images/un8.svg">-->
<!--                    <br><br>-->
<!--                    <h3>多端支持</h3>-->
<!--                    <p style="font-size: 14.8px;letter-spacing: 2px;">前端使用UNIAPP开发</p>-->
<!--                    <p style="font-size: 14.8px;letter-spacing: 2px;">一套源码，可编译H5、微信小程序、支付宝小程序、抖音小程序等多个平台</p>-->
<!--                </div>-->
<!--            </div>-->
<!--            <div class="layui-col-lg3 layui-col-md6 layui-col-sm6 layui-col-xs12">-->
<!--                <div class="feature">-->
<!--                    <img style="width:186px;height: 154px;" src="/component/front/images/un11.svg">-->
<!--                    <br><br>-->
<!--                    <h3>易于开发</h3>-->
<!--                    <p style="font-size: 14.8px;letter-spacing: 2px;">演示示例，组件式开发</p>-->
<!--                    <p style="font-size: 14.8px;letter-spacing: 2px;">用户技术解答服务论坛</p>-->
<!--                </div>-->
<!--            </div>-->
        </div>
    </div>
</div>

<div class="section" style="padding-bottom: 30px;padding-top: 30px;background-color: #f8f8f8;">
    <div class="layui-container">
        <div class="section-title" style="text-align: center;margin-bottom: 30px;">
            <h2 style="font-size: 28px;font-weight: 500;">部分功能案例展示</h2>
            <p style="font-size: 16px;color: #666;margin-top: 10px;">专业解决方案助力各行各业</p>
        </div>
        <div class="layui-row layui-col-space20">
            <div class="layui-col-md2 layui-col-xs12" style="background-color: #fff;padding: 15px 0;border-radius: 5px;">
                <ul style="list-style: none;padding: 0;margin: 0;" id="feature-menu">
                    <li data-target="marketing" style="padding: 10px 20px;font-size: 14px;cursor: pointer;border-left: 3px solid #4ACA85;" class="feature-menu-item active">全员营销及分销</li>
<!--                    <li data-target="logistics" style="padding: 10px 20px;font-size: 14px;cursor: pointer;" class="feature-menu-item">物流配送</li>-->
<!--                    <li data-target="auction" style="padding: 10px 20px;font-size: 14px;cursor: pointer;" class="feature-menu-item">竞拍功能</li>-->
<!--                    <li data-target="live" style="padding: 10px 20px;font-size: 14px;cursor: pointer;" class="feature-menu-item">直播功能</li>-->
<!--                    <li data-target="multi-merchant" style="padding: 10px 20px;font-size: 14px;cursor: pointer;" class="feature-menu-item">多商户</li>-->
<!--                    <li data-target="notification" style="padding: 10px 20px;font-size: 14px;cursor: pointer;" class="feature-menu-item">消息通知</li>-->
<!--                    <li data-target="platforms" style="padding: 10px 20px;font-size: 14px;cursor: pointer;" class="feature-menu-item">各平台效果</li>-->
                    <li data-target="aichat" style="padding: 10px 20px;font-size: 14px;cursor: pointer;" class="feature-menu-item">AI聊天</li>
                    <li data-target="more" style="padding: 10px 20px;font-size: 14px;cursor: pointer;" class="feature-menu-item">更多功能</li>
                </ul>
            </div>
            <div class="layui-col-md10 layui-col-xs12">
                <!-- 全员营销及分销内容 -->
                <div id="content-marketing" class="feature-content" style="display: block;">
                    <div class="layui-row layui-col-space15">
                        <div class="layui-col-md2 layui-col-xs6 layui-col-sm4">
                            <div style="text-align: center;background-color: #fff;padding: 15px;border-radius: 5px;box-shadow: 0 2px 10px rgba(0,0,0,0.05);">
                                <img src="/static/home/images/team.png"  style="width: 100%;border-radius: 5px;">
                                <p style="margin-top: 10px;font-size: 14px;color: #333;">三级分销</p>
                            </div>
                        </div>
                        <div class="layui-col-md2 layui-col-xs6 layui-col-sm4">
                            <div style="text-align: center;background-color: #fff;padding: 15px;border-radius: 5px;box-shadow: 0 2px 10px rgba(0,0,0,0.05);">
                                <img src="/static/home/images/coupon.png"  style="width: 100%;border-radius: 5px;">
                                <p style="margin-top: 10px;font-size: 14px;color: #333;">优惠券</p>
                            </div>
                        </div>
                        <div class="layui-col-md2 layui-col-xs6 layui-col-sm4">
                            <div style="text-align: center;background-color: #fff;padding: 15px;border-radius: 5px;box-shadow: 0 2px 10px rgba(0,0,0,0.05);">
                                <img src="/static/home/images/seckill.png"  style="width: 100%;border-radius: 5px;">
                                <p style="margin-top: 10px;font-size: 14px;color: #333;">秒杀</p>
                            </div>
                        </div>
                    </div>
                    
                </div>
                
                <!-- 物流配送内容 -->
                <div id="content-logistics" class="feature-content" style="display: none;">
                    <div class="layui-row layui-col-space15">
                        <div class="layui-col-md3 layui-col-xs6 layui-col-sm4">
                            <div style="text-align: center;background-color: #fff;padding: 15px;border-radius: 5px;box-shadow: 0 2px 10px rgba(0,0,0,0.05);">
                                <img src="/static/images/express_demo.png"  style="width: 100%;border-radius: 5px;">
                                <p style="margin-top: 10px;font-size: 14px;color: #333;">快递物流</p>
                            </div>
                        </div>
                        <div class="layui-col-md3 layui-col-xs6 layui-col-sm4">
                            <div style="text-align: center;background-color: #fff;padding: 15px;border-radius: 5px;box-shadow: 0 2px 10px rgba(0,0,0,0.05);">
                                <img src="/static/images/delivery_demo.png"  style="width: 100%;border-radius: 5px;">
                                <p style="margin-top: 10px;font-size: 14px;color: #333;">同城配送</p>
                            </div>
                        </div>
                        <div class="layui-col-md3 layui-col-xs6 layui-col-sm4">
                            <div style="text-align: center;background-color: #fff;padding: 15px;border-radius: 5px;box-shadow: 0 2px 10px rgba(0,0,0,0.05);">
                                <img src="/static/images/local_delivery_demo.png"  style="width: 100%;border-radius: 5px;">
                                <p style="margin-top: 10px;font-size: 14px;color: #333;">物流跟踪</p>
                            </div>
                        </div>
                    </div>
                </div>
                
                <!-- 其他功能内容 -->
                <div id="content-auction" class="feature-content" style="display: none;">
                    <div class="layui-row layui-col-space15">
                        <div class="layui-col-md4 layui-col-xs12">
                            <div style="text-align: center;background-color: #fff;padding: 15px;border-radius: 5px;box-shadow: 0 2px 10px rgba(0,0,0,0.05);">
                                <img src="/static/images/flash_sale_demo.png"  style="width: 100%;border-radius: 5px;">
                                <p style="margin-top: 10px;font-size: 14px;color: #333;">竞拍功能展示</p>
                            </div>
                        </div>
                    </div>
                </div>
                
                <div id="content-live" class="feature-content" style="display: none;">
                    <div class="layui-row layui-col-space15">
                        <div class="layui-col-md4 layui-col-xs12">
                            <div style="text-align: center;background-color: #fff;padding: 15px;border-radius: 5px;box-shadow: 0 2px 10px rgba(0,0,0,0.05);">
                                <img src="/static/images/un11.svg" style="width: 100%;border-radius: 5px;">
                                <p style="margin-top: 10px;font-size: 14px;color: #333;">直播功能展示</p>
                            </div>
                        </div>
                    </div>
                </div>
                
                <div id="content-multi-merchant" class="feature-content" style="display: none;">
                    <div class="layui-row layui-col-space15">
                        <div class="layui-col-md4 layui-col-xs12">
                            <div style="text-align: center;background-color: #fff;padding: 15px;border-radius: 5px;box-shadow: 0 2px 10px rgba(0,0,0,0.05);">
                                <img src="/static/images/un11.svg" style="width: 100%;border-radius: 5px;">
                                <p style="margin-top: 10px;font-size: 14px;color: #333;">多商户功能展示</p>
                            </div>
                        </div>
                    </div>
                </div>
                
                <div id="content-notification" class="feature-content" style="display: none;">
                    <div class="layui-row layui-col-space15">
                        <div class="layui-col-md4 layui-col-xs12">
                            <div style="text-align: center;background-color: #fff;padding: 15px;border-radius: 5px;box-shadow: 0 2px 10px rgba(0,0,0,0.05);">
                                <img src="/static/images/un11.svg" style="width: 100%;border-radius: 5px;">
                                <p style="margin-top: 10px;font-size: 14px;color: #333;">消息通知功能展示</p>
                            </div>
                        </div>
                    </div>
                </div>
                
                <div id="content-platforms" class="feature-content" style="display: none;">
                    <div class="layui-row layui-col-space15">
                        <div class="layui-col-md4 layui-col-xs12">
                            <div style="text-align: center;background-color: #fff;padding: 15px;border-radius: 5px;box-shadow: 0 2px 10px rgba(0,0,0,0.05);">
                                <img src="/static/images/un11.svg" style="width: 100%;border-radius: 5px;">
                                <p style="margin-top: 10px;font-size: 14px;color: #333;">各平台效果展示</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div id="content-aichat" class="feature-content" style="display: none;">
                    <div class="layui-row layui-col-space15">
                        <div class="layui-col-md2 layui-col-xs6 layui-col-sm4">
                            <div style="text-align: center;background-color: #fff;padding: 15px;border-radius: 5px;box-shadow: 0 2px 10px rgba(0,0,0,0.05);">
                                <img src="/static/home/images/aichat.png" style="width: 100%;border-radius: 5px;">
                                <p style="margin-top: 10px;font-size: 14px;color: #333;">AI聊天</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div id="content-more" class="feature-content" style="display: none;">
                    <div class="layui-row layui-col-space15">
                        <div class="layui-col-md4 layui-col-xs12">
                            <div style="text-align: center;background-color: #fff;padding: 15px;border-radius: 5px;box-shadow: 0 2px 10px rgba(0,0,0,0.05);">
                                <img src="/static/home/images/more.png" style="width: 100%;border-radius: 5px;">
                                <p style="margin-top: 10px;font-size: 14px;color: #333;">更多功能持续开发中....</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
layui.use(['jquery'], function(){
    var $ = layui.jquery;
    
    // 菜单点击事件
    $('#feature-menu .feature-menu-item').on('click', function() {
        // 移除所有菜单项的活动状态
        $('#feature-menu .feature-menu-item').css('border-left', 'none');
        
        // 添加当前点击项的活动状态
        $(this).css('border-left', '3px solid #4ACA85');
        
        // 获取目标内容区域ID
        var targetId = 'content-' + $(this).data('target');
        
        // 隐藏所有内容区域
        $('.feature-content').hide();
        
        // 显示目标内容区域
        $('#' + targetId).show();
    });
});
</script>

{include file="layout/footer"}
</body>

</html>